<template>
  <div>
    {{ getMenu() }}
    <el-menu
      default-active="2"
      class="el-menu-vertical-demo">
      <el-menu-item index="1" :style="has.user"  @click="to('/home/userM')">
        <template slot="title">
          <i class="el-icon-user"></i>
          <span>用户管理</span>
        </template>
      </el-menu-item>
      <el-submenu index="2" :style="has.sys">
        <template slot="title">
          <i class="el-icon-setting"></i>
          <span>系统管理</span>
        </template>
        <el-menu-item :style="has.role" index="2-1" @click="to('/home/roleM')"><i class="el-icon-s-custom"X></i><span>角色权限</span>
        </el-menu-item>
        <el-menu-item :style="has.menu" index="2-2" @click="to('/home/menuM')"><i class="el-icon-s-check"></i><span>菜单管理</span></el-menu-item>
      </el-submenu>
      <el-submenu index="3" :style="has.goods">
        <template slot="title">
          <i class="el-icon-goods"></i>
          <span>商品管理</span>
        </template>
        <el-menu-item :style="has.drink" index="3-1" @click="to('/home/drinkM')"><i class="el-icon-ice-drink"></i><span>饮品管理</span>
        </el-menu-item>
        <el-menu-item :style="has.entermets" index="3-2" @click="to('/home/entremetsM')"><i class="el-icon-grape"></i><span>配料管理</span></el-menu-item>
      </el-submenu>
      <el-submenu index="4" :style="has.manage">
        <template slot="title">
          <i class="el-icon-s-data"></i>
          <span>经营管理</span>
        </template>
        <el-menu-item :style="has.sell" index="4-1" @click="to('/home/sellM')"><i class="el-icon-notebook-1"></i><span>销量报表</span>
        </el-menu-item>
        <el-menu-item :style="has.stock" index="4-2" @click="to('/home/stockM')"><i class="el-icon-notebook-2"></i><span>进货记录</span></el-menu-item>
      </el-submenu>
      <el-submenu index="5" :style="has.order">
        <template slot="title">
          <i class="el-icon-message-solid"></i>
          <span>订单管理</span>
        </template>
        <el-menu-item :style="has.orderQuery" index="5-1" @click="to('/home/orderQueryM')"><i class="el-icon-tickets"></i><span>订单查询</span></el-menu-item>
        <el-menu-item :style="has.orderQueue" index="5-2" @click="to('/home/orderQueueM')"><i class="el-icon-bell"></i><span>订单处理</span></el-menu-item>
      </el-submenu>
    </el-menu>
  </div>


</template>

<script>
import axios from "axios";

export default {
  name: "Aside",
  data() {
    return {
      refresh: 0,
      block: 'display: block',
      has: {
        user: 'display: none',
        sys: 'display: none',
        role: 'display: none',
        menu: 'display: none',
        goods: 'display: none',
        drink: 'display: none',
        entremets: 'display: none',
        manage: 'display: none',
        sell: 'display: none',
        stock: 'display: none',
        order: 'display: none',
        orderQuery: 'display: none',
        orderQueue: 'display: none',
      }
    }
  },
  methods: {
    getMenu: function () {
      if (this.refresh === 0) {
        this.refresh++;
        var that = this;
        axios.get("http://localhost:8081/menu/" + this.$route.query.roleId).then(function (result) {
          var menus = result.data.data;
          for (let i = 0; i < menus.length; i++) {
            let menu = menus[i];
            if ('sys:user:view' === menu.permission) that.has.user = that.block;
            if ('sys:system:view' === menu.permission) that.has.sys = that.block;
            if ('sys:role:view' === menu.permission) that.has.role = that.block;
            if ('sys:menu:view' === menu.permission) that.has.menu = that.block;
            if ('sys:goods:view' === menu.permission) that.has.goods = that.block;
            if ('sys:drink:view' === menu.permission) that.has.drink = that.block;
            if ('sys:entremets:view' === menu.permission) that.has.entremets = that.block;
            if ('sys:manage:view' === menu.permission) that.has.manage = that.block;
            /*if ('sys:sell:view' === menu.permission) */that.has.sell = that.block;
            if ('sys:stock:view' === menu.permission) that.has.stock = that.block;
            if ('sys:order:view' === menu.permission) that.has.order = that.block;
            /*if ('sys:orderQuery:view' === menu.permission) */that.has.orderQuery = that.block;
            /*if ('sys:orderQueue:view' === menu.permission)*/ that.has.orderQueue = that.block;
          }
        })
      }
    },
    to: function (url) {
      if (this.$route.path !== url) {
        this.$router.push(url);
      }
    }
  }
}
</script>

<style scoped>

</style>
